<!DOCTYPE HTML>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>信用资产管理系统</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="./dist/css/reset.css">
    <link rel="stylesheet" type="text/css" href="./dist/css/normalize.css">
    <link rel="stylesheet" href="./dist/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="./dist/bootstrap-datelimepicker/bootstrap-datetimepicker.min.css">
    <link rel="stylesheet" href="./dist/css/homePage.css">
    <style>

    </style>
</head>

<body>
    <!--=== nav ===-->
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container">
            <div class="row clearfix">
                <div class="col-sm-3 col-md-3 navbar-header">
                    <a href="#" class="navbar-brand"><img class="logoImg" src="./dist/img/logo.png"> <span>信用资产管理系统</span> </a>
                </div>
                <ul class="col-sm-9 col-md-9 nav navbar-nav navbar-right">
                    <li class="col-sm-2 col-md-2"><a href="homePage.html" class="navItemActive">首页</a></li>
                    <li class="col-sm-2 col-md-2"><a href=" repayment.html ">还款</a></li>
                    <li class="col-sm-2 col-md-2"><a href="payRecord.html">消费记录</a></li>
                    <li class="col-sm-2 col-md-2"><a href=" cardManage.html">卡片管理</a></li>
                    <li class="col-sm-2 col-md-2"><a href="#">商户管理</a></li>
                    <li class="col-sm-2 col-md-2"><a href=" setUp.html   ">设置</a></li>
                    <div class="loginOut"><a class="loginOut " href="# ">退出</a></div>
                </ul>
            </div>
        </div>
    </nav>
    <div class="container content">
        <div class="row margin-top22 ">
            <!-- === 左边 === -->
            <section class="col-sm-3 col-md-3 sidebar ">
                <div class="carbonads ">
                    <div class="carbon-wrap ">
                        <img src="./dist/img/photo.png " alt=" " border="0 " height="67 " width="70 " style="max-width:70px; ">
                    </div>
                    <div class="catbon-text ">管理员 <span class="admin-name ">administrator</span></div>
                </div>
                <ul class="card-list ">
                    <li class="card-item ">
                        <div class="card-left ">
                            行用卡数量:
                        </div>
                        <div class="card-right ">16张</div>
                    </li>
                    <li class="card-item ">
                        <div class="card-left ">
                            总额度:
                        </div>
                        <div class="card-right ">￥22000</div>
                    </li>
                    <li class="card-item ">
                        <div class="card-left ">
                            可用额度：
                        </div>
                        <div class="card-right ">￥180000</div>
                    </li>
                    <li class="card-item ">
                        <div class="card-left ">
                            余额合计:
                        </div>
                        <div class="card-right ">￥9800</div>
                    </li>
                </ul>
                <form class="form-horizontal card-info-form clearfix ">
                    <div class="form-group ">
                        <label for="inputEmail3 " class="col-md-3 control-label ">账户</label>
                        <div class="col-md-9 ">
                            <select class="form-control card-option ">
                                <option>我自己的招商8522</option>
                                <option>我自己的招商8523</option>
                                <option>我自己的招商8524</option>
                                <option>我自己的招商8525</option>
                                <option>我自己的招商8526</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group ">
                        <label for="usable-money " class="col-md-3 control-label ">可用</label>
                        <div class="col-md-9 ">
                            <input type="text " class="form-control " readonly placeholder="￥8500 ">
                        </div>
                    </div>
                    <div class="form-group ">
                        <label for="inputPassword3 " class="col-md-3 control-label ">商户</label>
                        <div class="col-md-9 ">
                            <input type="text " class="form-control " placeholder="杭州人家餐饮 ">
                        </div>
                    </div>
                    <div class="form-group ">
                        <label for="inputPassword3 " class="col-md-3 control-label ">金额</label>
                        <div class="col-md-9 ">
                            <input type="text " class="form-control " placeholder="￥780 ">
                        </div>
                    </div>
                    <div class="form-group ">
                        <label for="inputPassword3 " class="col-md-3 control-label ">时间</label>
                         <div class="calendarInput input-group date form_date col-sm-9 col-md-9" data-date="" data-date-format="yyyy-mm-dd">
                            <input class="form-control" size="16" type="text" value="" readonly>
                            <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                            <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
                        </div>
                    </div>
                    <div class="form-group ">
                        <label for="inputPassword3 " class="col-md-3 control-label ">备注</label>
                        <div class="col-md-9 ">
                            <textarea class="form-control " rows="2 " style="resize:none "></textarea>
                        </div>
                    </div>
                    <button type="submit " class="btn btn-primary pull-right saveBtn">保存</button>
                </form>
                <div class="card-date-info .col-md-8 ">
                    <p class="text-left card-date-title ">账户信息</p>
                    <p class="card-date-content clearfix ">
                        <span class="text-left pull-left ">注册日期：</span>
                        <span class="text-right pull-right ">2018年1月12日</span>
                    </p>
                    <p class="card-date-content clearfix ">
                        <span class="text-left pull-left ">有效日期：</span>
                        <span class="text-right pull-right ">2019年1月12日</span>
                    </p>
                </div>
            </section>
            <!-- === 右边 === -->
            <article class="col-sm-9 col-md-9 article ">
                <div class="article-top clearfix ">
                    <div class="col-md-3 col-lg-3 count ">
                        <div class="title count-title ">月消费数据</div>
                        <ul class="count-list ">
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text ">当月已消费</span>
                                <span class="pull-right col-sm-6 count-num ">￥12000</span>
                            </li>
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text ">当月已消费</span>
                                <span class="pull-right col-sm-6 count-num ">￥12000</span>
                            </li>
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text ">当月已消费</span>
                                <span class="pull-right col-sm-6 count-num ">￥12000</span>
                            </li>
                        </ul>
                    </div>
                    <div class="col-md-3 col-lg-3 count ">
                        <div class="title count-title ">还款信息统计</div>
                        <ul class="count-list ">
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text ">已出账单合计</span>
                                <span class="pull-right col-sm-6 count-num ">￥6000</span>
                            </li>
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text ">已出账单合计</span>
                                <span class="pull-right col-sm-6 count-num ">￥6000</span>
                            </li>
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text ">已出账单合计</span>
                                <span class="pull-right col-sm-6 count-num ">￥6000</span>
                            </li>
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text ">已出账单合计</span>
                                <span class="pull-right col-sm-6 count-num ">￥6000</span>
                            </li>
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text ">已出账单合计</span>
                                <span class="pull-right col-sm-6 count-num ">￥6000</span>
                            </li>
                        </ul>
                    </div>
                    <div class="col-md-3 col-lg-3 count ">
                        <div class="title count-title ">当天提醒事项</div>
                        <ul class="count-list ">
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text count-text3 ">已出账单已出账单已出账单</span>
                            </li>
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text count-text3 ">已出账单已出账单已出账单</span>
                            </li>
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text count-text3 ">已出账单已出账单已出账单</span>
                            </li>
                            <li class="clearfix count-item ">
                                <span class=" pull-left col-sm-6 count-text count-text3 ">已出账单已出账单已出账单</span>
                                <li class="clearfix count-item ">
                                    <span class=" pull-left col-sm-6 count-text count-text3 ">已出账单已出账单已出账单</span>
                                </li>
                                <li class="clearfix count-item ">
                                    <span class=" pull-left col-sm-6 count-text count-text3 ">已出账单已出账单已出账单</span>
                                </li>
                                <li class="clearfix count-item ">
                                    <span class=" pull-left col-sm-6 count-text count-text3 ">已出账单已出账单已出账单</span>
                                </li>
                        </ul>
                    </div>
                </div>
                <!-- ===右下=== -->
                <div class="article-bottom ">
                    <table class="table table-bordered ">
                        <thead class="account-list ">
                            <tr>
                                <th>消费时间</th>
                                <th>账户</th>
                                <th>消费金额</th>
                                <th>商户</th>
                                <th>可用额度</th>
                                <th>备注</th>
                            </tr>
                        </thead>
                        <tbody class="account-item ">
                            <tr>
                                <th scope="row ">2018430</th>
                                <td>浦发AE白金2022</td>
                                <td>300.00</td>
                                <td>加油站</td>
                                <td>12200.00</td>
                                <td>我是备注信息巴拉巴拉巴拉</td>
                            </tr>
                            <!--   <tr>
                            <th scope="row ">20181230</th>
                            <td>浦发AE白金20228888888</td>
                            <td>30088888888.00</td>
                            <td>加油站8888888888888888888888888888888</td>
                            <td>12208888888888880.00</td>
                            <td>我是备注信息巴拉巴拉巴拉88888888888888</td>
                        </tr> -->
                            <tr>
                                <th scope="row ">2018430</th>
                                <td>浦发AE白金2022</td>
                                <td>300.00</td>
                                <td>加油站</td>
                                <td>12200.00</td>
                                <td>我是备注信息巴拉巴拉巴拉</td>
                            </tr>
                            <tr>
                                <th scope="row ">2018430</th>
                                <td>浦发AE白金2022</td>
                                <td>300.00</td>
                                <td>加油站</td>
                                <td>12200.00</td>
                                <td>我是备注信息巴拉巴拉巴拉</td>
                            </tr>
                            <tr>
                                <th scope="row ">2018430</th>
                                <td>浦发AE白金2022</td>
                                <td>300.00</td>
                                <td>加油站</td>
                                <td>12200.00</td>
                                <td>我是备注信息巴拉巴拉巴拉</td>
                            </tr>
                            <tr>
                                <th scope="row ">2018430</th>
                                <td>浦发AE白金2022</td>
                                <td>300.00</td>
                                <td>加油站</td>
                                <td>12200.00</td>
                                <td>我是备注信息巴拉巴拉巴拉</td>
                            </tr>
                            <tr>
                                <th scope="row ">2018430</th>
                                <td>浦发AE白金2022</td>
                                <td>300.00</td>
                                <td>加油站</td>
                                <td>12200.00</td>
                                <td>我是备注信息巴拉巴拉巴拉</td>
                            </tr>
                            <tr>
                                <th scope="row ">2018430</th>
                                <td>浦发AE白金2022</td>
                                <td>300.00</td>
                                <td>加油站</td>
                                <td>12200.00</td>
                                <td>我是备注信息巴拉巴拉巴拉</td>
                            </tr>
                            <tr>
                                <th scope="row ">2018430</th>
                                <td>浦发AE白金2022</td>
                                <td>300.00</td>
                                <td>加油站</td>
                                <td>12200.00</td>
                                <td>我是备注信息巴拉巴拉巴拉</td>
                            </tr>
                            <tr>
                                <th scope="row ">2018430</th>
                                <td>浦发AE白金2022</td>
                                <td>300.00</td>
                                <td>加油站</td>
                                <td>12200.00</td>
                                <td>我是备注信息巴拉巴拉巴拉</td>
                            </tr>
                            <tr>
                                <th scope="row ">2018430</th>
                                <td>浦发AE白金2022</td>
                                <td>300.00</td>
                                <td>加油站</td>
                                <td>12200.00</td>
                                <td>我是备注信息巴拉巴拉巴拉</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </article>
             <!-- ===分页=== -->
            <nav aria-label="Page navigation " class="clearfix queryPage">
                    <ul class="pagination pull-right ">
                        <li>
                            <a href="# " aria-label="Previous ">
                               <span aria-hidden="true ">&laquo;</span>
                                </a>
                        </li>
                        <li><a href="# ">1</a></li>
                        <li><a href="# ">2</a></li>
                        <li><a href="# ">3</a></li>
                        <li><a href="# ">4</a></li>
                        <li><a href="# ">5</a></li>
                        <li><a href="# ">6</a></li>
                        <li>
                            <a href="# " aria-label="Next ">
                                 <span aria-hidden="true ">&raquo;</span>
                             </a>
                        </li>
                    </ul>
                </nav>
</body>
<script src="./dist/jquery/jquery-1.8.3.min.js "></script>
<script src="./dist/bootstrap/js/bootstrap.min.js "></script>
<script type="text/javascript " src="dist/bootstrap-datelimepicker/bootstrap-datetimepicker.min.js "></script>
<script type="text/javascript " src="dist/bootstrap-datelimepicker/bootstrap-datetimepicker.zh-CN.js "></script>
<script type="text/javascript ">
$('.form_date').datetimepicker({
    language: 'zh-CN',
    weekStart: 1,
    todayBtn: 1,
    autoclose: 1,
    todayHighlight: 1,
    startView: 2,
    minView: 2,
    forceParse: 0
});
</script>

</html>
